﻿<div class="sample_title">Basic Popup</div>

This is the way to open popup modal
<div class="sample_code" rel="brush: js; html-script: false;">
    &lt;script type="text/javascript"&gt
        
        // Popup With Local Content
        var $popup1 = openPopup( /* Configuration */ );
        
        // Popup With Remote Content
        var $popup2 = openPopup( /* URL Address */ , /* Configuration */ );
        
    &lt;/script&gt;
    <% for (int i = 0, max_i = 8; i < max_i; i++) { Response.Write("<br />"); } %>
</div>
<br />

<fieldset>
    <legend>Configuration</legend>
    <table class="tb_apiconfig">
    <tr>
        <td class="label">title</td>
        <td><font color="blue">(string), default: ''</font><br />
            Title of popup header
        </td>
    </tr>
    <tr>
        <td class="label">width</td>
        <td><font color="blue">(numeric), default: 780</font><br />
            Set width of popup size
        </td>
    </tr>
    <tr>
        <td class="label">height</td>
        <td><font color="blue">(numeric), default: 450</font><br />
            Set height of popup size
        </td>
    </tr>
    <tr>
        <td class="label">position</td>
        <td><font color="blue">(Array), default: null</font><br />
            Specifies where the dialog should be displayed. Possible values: <br />
            1) a single string representing position within viewport: 'center', 'left', 'right', 'top', 'bottom'. <br />
            2) an array containing an x,y coordinate pair in pixel offset from left, top corner of viewport (e.g. [350,100]) <br />
            3) an array containing x,y position string values (e.g. ['right','top'] for top right corner).
        </td>
    </tr>
    <tr>
        <td class="label">open</td>
        <td><font color="blue">(function)</font><br />
            Will executed after popup opened
        </td>
    </tr>
    <tr>
        <td class="label">close</td>
        <td><font color="blue">(function)</font><br />
            Will executed after popup closed
        </td>
    </tr>
    </table>
</fieldset>

<br />
This is the way to close popup modal
<div class="sample_code" rel="brush: js; html-script: false;">
    &lt;script type="text/javascript"&gt
        closePopup();
    &lt;/script&gt;
    <% for (int i = 0, max_i = 3; i < max_i; i++) { Response.Write("<br />"); } %>
</div><br />
<%--
<br /><br /><br /><br />
    
<div class="sample_title">Simple Popup With Local Content</div>

sample:<br />
<div class="sample_preview">
    <script type="text/javascript"><!--//--><![CDATA[//><!--
        $(document).ready(function() {
            // Bind Event Click
            $('#btn_popup1').click(function() {
                // Create Popup Object
                var $popup = openPopup();

                // Assign popup
                $popup.html("This is my popup..");
            });
        });
    //--><!]]></script>
    <button id="btn_popup1">Open Popup</button>
</div><br />
code:
<div class="sample_code" rel="brush: js; html-script: false;">
    &lt;script type="text/javascript"&gt
        $(document).ready(function() {
            // Bind Event Click
            $('#btn_popup').click(function() {
                // Create Popup Object
                var $popup = openPopup();

                // Assign popup content
                $popup.html("This is my popup..");
            });
        });
    &lt;/script&gt;
    
    &lt;button id="btn_popup"&gt;Open Popup&lt;/button&gt;
    <% for (int i = 0, max_i = 12; i < max_i; i++) { Response.Write("<br />"); } %>
</div>

<br /><br /><br /><br />

<div class="sample_title">Popup with Ajax Remote Request Page</div>

sample:<br />
<div class="sample_preview">
    <script type="text/javascript"><!--//--><![CDATA[//><!--
        $(document).ready(function() {
            // Bind Event Click
            $('#btn_popup2').click(function() {
                // Call Popup Modal
                var $popup = openPopup(gs_path + '/App/API/?view=form_popup_content');
            });
        });
        //--><!]]></script>
    <button id="btn_popup2">Open Popup</button>
</div><br />
code:
<div class="sample_code" rel="brush: js; html-script: false;">
    &lt;script type="text/javascript"&gt
        $(document).ready(function() {
            // Bind Event Click
            $('#btn_popup').click(function() {
                // Call Popup Modal
                var $popup = openPopup(gs_path + '/App/API/?view=form_popup_content');
            });
        });
    &lt;/script&gt;
    
    &lt;button id="btn_popup"&gt;Open Popup&lt;/button&gt;
    <% for (int i = 0, max_i = 9; i < max_i; i++) { Response.Write("<br />"); } %>
</div>--%>